import React from 'react';
import { connect } from 'umi';
import { Table } from 'antd';
import { tableLocale } from '@/tool/components/PageEmpty';
import styles from './index.less';

const { Column } = Table;

export const RollingTable = (props) => {
  return (
    <Table
      className={styles.RollingTable}
      locale={tableLocale}
      dataSource={props.rollingTableData}
      pagination={false}
      bordered={true}
      rowKey="timeOrder"
    >
      <Column align="center" title="时点" dataIndex="timeOrder" key="timeOrder" width={100} />
      <Column
        align="center"
        title="算数平均价"
        dataIndex="weightedAveragePrice"
        key="weightedAveragePrice"
        width={100}
        render={(text) => text.toFixed(2)}
      />
      <Column
        align="center"
        title="中位数价格"
        dataIndex="midPrice"
        key="midPrice"
        width={100}
        render={(text) => text.toFixed(2)}
      />
      <Column
        align="center"
        title="最低价格"
        dataIndex="lowestPrice"
        key="lowestPrice"
        width={100}
        render={(text) => text.toFixed(2)}
      />
      <Column
        align="center"
        title="最高价格"
        dataIndex="highestPrice"
        key="highestPrice"
        width={100}
        render={(text) => text.toFixed(2)}
      />
      <Column
        align="center"
        title="上限价格"
        dataIndex="floorPrice"
        key="floorPrice"
        width={100}
        render={(text) => text.toFixed(2)}
      />
      <Column
        align="center"
        title="下限价格"
        dataIndex="ceilPrice"
        key="ceilPrice"
        width={100}
        render={(text) => text.toFixed(2)}
      />
      <Column
        align="center"
        title="日前电价"
        dataIndex="proposedPrice"
        key="proposedPrice"
        width={100}
        render={(text) => text.toFixed(2)}
      />
      <Column
        align="center"
        title="成交电量(日均)"
        dataIndex="clearPower"
        key="clearPower"
        width={100}
        render={(text) => text.toFixed(3)}
      />
    </Table>
  );
};

const mapStateToProps = ({ mediumAndLongTermMarket }) => ({
  rollingTableData: mediumAndLongTermMarket.rollingTableData,
});

const mapDispatchToProps = {};

export default connect(mapStateToProps, mapDispatchToProps)(RollingTable);
